<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>管理员登录-成都华联后台管理系统</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
        <link rel="stylesheet" href="layui/css/layui.css" media="all">
        <!-- 阿里云验证码js，国内使用 -->
        <script type="text/javascript" charset="utf-8" src="//g.alicdn.com/sd/ncpc/nc.js?t=2015052012"></script>
        <script src="layui/layui.js" charset="utf-8"></script>
        <script>var $ = layui.jquery;var form = layui.form;var layer = layui.layer;</script>
        <style>
            body {
                background: url("images/admin_login_bk.png");
                height: 100%;width: 100%;
                background-size:cover;
                background-attachment: fixed;
            }
            div.container{
                width: 310px;
                height: 195px;
                border: 2px solid #A67EEF;
                border-radius: 10px;
                position: absolute;
                left: 0;
                top: 0;
                bottom: 0;
                right: 0;
                margin: auto;
                padding: 8px;
            }
        </style>
    </head>
    <body>
        <div class="container" align="center">
            <!--右边表单-->
            <form class="layui-form layui-form-pane" action="">
                <!--style="float: left;width: 410px;margin-top: 110px;margin-left: -20px"-->
                <!--手机号-->
                <div class="layui-form-item">
                    <label class="layui-form-label">手机号</label>
                    <div class="layui-input-inline">
                        <input type="text" name="phone" lay-verify="required|phone" autocomplete="off"
                               placeholder="请输入手机号"
                               class="layui-input">
                    </div>
                </div>
                <!--密码-->
                <div class="layui-form-item">
                    <label class="layui-form-label">密码</label>
                    <div class="layui-input-inline">
                        <input type="password" name="password" placeholder="请输入密码" autocomplete="off"
                               lay-verify="required"
                               class="layui-input">
                    </div>
                </div>
                <!--滑动验证码-->
                <div class="layui-form-item">
                    <div class="layui-input-inline">
                        <div id="your-dom-id" class="nc-container"></div>
                    </div>
                </div>
                <!--登录按钮-->
                <div class="layui-form-item" align="center">
                    <div class="layui-input-inline" style="margin-left: 47px">
                        <button type="submit" id="loginBtn" class="layui-btn layui-btn-disabled"
                                style="text-align: center;width: 200px"
                                disabled="disabled"
                                lay-submit="" lay-filter="loginBtn">登录
                        </button>
                    </div>
                </div>
            </form>
        </div>


        <script type="text/javascript">
            var nc_token = ["FFFF0N000000000093A3", (new Date()).getTime(), Math.random()].join(':');
            var NC_Opt =
                {
                    renderTo: "#your-dom-id",
                    appkey: "FFFF0N000000000093A3",
                    scene: "nc_login",
                    token: nc_token,
                    customWidth: 300,
                    trans: {"key1": "code0"},
                    elementID: ["usernameID"],
                    is_Opt: 0,
                    language: "cn",
                    isEnabled: true,
                    timeout: 3000,
                    times: 5,
                    apimap: {},
                    callback: function (data) {
                        /*人机验证成功后，改变按钮为：可点击且样式改变*/
                        $("#loginBtn").attr("disabled", false);
                        $("#loginBtn").removeClass("layui-btn-disabled");
                    }
                }
            var nc = new noCaptcha(NC_Opt)
            nc.upLang('cn', {
                _startTEXT: "请按住滑块，拖动到最右边",
                _yesTEXT: "验证通过",
                _error300: "哎呀，出错了，点击<a href=\"javascript:__nc.reset()\">刷新</a>再来一次",
                _errorNetwork: "网络不给力，请<a href=\"javascript:__nc.reset()\">点击刷新</a>",
            })

            //监听提交
            form.on('submit(loginBtn)', function () {
                var phone = $("input[name=phone]").val();
                var pwd = $("input[name=password]").val();
                if (phone!=null&&pwd!=null){
                    $.ajax({
                        url: "/admin"
                        , type: "post"
                        , headers: {"method": "login"}
                        , data: {
                            "phone": phone,
                            "pwd": pwd
                        }
                        , dataType: "json"
                        , success: function (result) {
                            if (result.code == 1) {
                                layer.msg('正在登录...',{icon:1,time:1000,shade:0.4},function() {
                                    window.localStorage.setItem("auth",phone);
                                    location.href = "/adminHome";
                                });
                            } else if (result.code == 0) {
                                layer.msg(result.msg);
                            }
                        }
                    })
                    return false;
                }

            })
        </script>
    </body>
</html>